import { ref, getCurrentInstance, onMounted } from 'vue'
import { docLayer } from '@/hook/LoadBasicMap/index.js'
import { addPopUp } from '@/hook/mapgis-api/addPopUp'
import { storeToRefs } from 'pinia'
import { useCommonStore } from '@/stores/common'
/* 引入公共状态管理对象 */
const store = useCommonStore()
const { addEventFlag ,isShowaddEven} = storeToRefs(store)

export const useAddEventHook = () => {
  const { proxy } = getCurrentInstance()
  /* 事件的添加 */
  let eventPopup = null
  let $map = null

  const form = ref({
    number: '',
    type: '',
    level: '',
    data: '',
    loaction: '',
    CarNumber: '',
    driver: '',
    status: ''
  })

  const handleAddEvent = () => {
    /**点击置为true */
    addEventFlag.value = true
    /**地图添加点击监听 */
    $map.on('click', (e) => {
      // console.log(e)
      if (!addEventFlag.value) {
        return
      }
      isShowaddEven.value = true
      //设置弹窗的位置
      eventPopup.setPosition(e.coordinate)
    })
  }

  /* 事件的提交 */
  const handleSubmit = () => {
    //获取position
    let position = eventPopup.getPosition()
    // console.log(position)
    // 关闭弹窗
    isShowaddEven.value = false
    eventPopup.setPosition(undefined)
    // 重置表单,换算事件时间
    // console.log(form.value.data)
    let timedata = form.value.data
    if (typeof timedata==='object') {
      timedata = `${timedata.getFullYear()}.${timedata.getMonth() + 1}.${timedata.getDate()} ${timedata.getHours()}:${timedata.getMinutes()}`
    }
    form.value.data = timedata
    // console.log(form.value)

    let attr = [
      { name: '事件编号', type: 'string', value: form.value.number },
      { name: '事件类型', type: 'string', value: form.value.type },
      { name: '事件等级', type: 'int', value: form.value.level },
      { name: '发生时间', type: 'datetime', value: form.value.data },
      { name: '发生地点', type: 'string', value: form.value.loaction },
      { name: '车牌号', type: 'string', value: form.value.CarNumber },
      { name: '驾驶员', type: 'string', value: form.value.driver },
      { name: '处理状态', type: 'int', value: form.value.status }
    ]
    let service = {
      name: 'guanggu',
      layerId: 2
    }

    addEvent({
      position,
      attr,
      service,
      docLayer
    })
    // 重置表单
  }

  /* 事件的取消 */
  const handleCancel = () => {
    isShowaddEven.value = false
    eventPopup.setPosition(undefined)
  }

  onMounted(() => {
    eventPopup = addPopUp.add({
      target: document.querySelector('#event-popup')
    })
    $map = proxy.$map
    $map.addOverlay(eventPopup)
  })

  /**
   * @param {Array} position = [114.30,30.50]
   * @param {Array} attr = [{name:"name",type:"string",value:"Point"}]
   * @param {Object} service = {name:"xzd-test",layerId:2}
   *  */
  function addEvent({ position, attr, service, docLayer }) {
    var gpoint = new Zondy.Object.GPoint(position[0], position[1]) //createPoint();
    //设置当前点要素的几何信息
    var fGeom = new Zondy.Object.FeatureGeometry({
      PntGeom: [gpoint]
    })
    /* 1-2、style */
    let pointInfo = new Zondy.Object.CPointInfo({
      Angle: 0,
      Color: 6, //子图颜色
      Space: 0,
      SymHeight: 5,
      SymID: 21, //子图号
      SymWidth: 5
    })
    if (attr[7].value === '1') {
      pointInfo = new Zondy.Object.CPointInfo({
        Angle: 0,
        Color: 4, //子图颜色
        Space: 0,
        SymHeight: 5,
        SymID: 21, //子图号
        SymWidth: 5
      })
    }
    //设置当前点要素的图形参数信息
    var webGraphicInfo = new Zondy.Object.WebGraphicsInfo({
      /* 1-Point  2-LineString 3-Area */
      InfoType: 1,
      PntInfo: pointInfo
    })
    /* 1-3、属性 */
    //设置添加点要素的属性信息
    var attValue = attr.map((item) => item.value)
    var feature = new Zondy.Object.Feature({
      fGeom: fGeom,
      GraphicInfo: webGraphicInfo,
      AttValue: attValue
    })
    //设置要素为点要素
    feature.setFType(1)
    /* 2、将创建的mapgis的要素集添加要素 source */
    /* new ol.source.Vector() */
    var featureSet = new Zondy.Object.FeatureSet()
    //设置属性结构  和mapgis中的图层映射
    var cAttStruct = new Zondy.Object.CAttStruct({
      FldName: attr.map((item) => item.name),
      FldNumber: attr.length,
      FldType: attr.map((item) => item.type)
    })
    featureSet.AttStruct = cAttStruct
    //添加要素到要素数据集
    featureSet.addFeature(feature)
    /* 3、调用服务执行添加 */
    var editService = new Zondy.Service.EditDocFeature(service.name, service.layerId, {})
    //执行添加点要素功能
    editService.add(featureSet, onPntSuccess(docLayer))
  }
  //添加点要素回调函数
  function onPntSuccess(docLayer) {
    return function (data) {
      if (data.succeed) {
        alert('添加事件成功！')
        docLayer.refresh()
      } else {
        alert('添加事件失败！')
      }
    }
  }

  return { handleCancel, handleAddEvent, handleSubmit, form }
}
